View GitHub Repository flynt

Schedule Inspection
Subscribe
Passed
Push — master ( 121632...aca41d )
by Dominik
08:03 queued 03:35
created

admin.js ➔ showComponentScreenshot   A

↳ Parent: Project

Complexity

Conditions 4

Size

Total Lines 9
Code Lines 6

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
cc 4
eloc 6
dl 0
loc 9
rs 10
c 0
b 0
f 0
1 
/* globals wpData */
2 
import $ from 'jquery'
3 

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    4
                

                                    
                                                    
                
                
                
const $body = $('body')

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    5
                

                                    
                                                    
                
                
                
const ajaxCache = {}

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    6
                

                                    
                                                    
                
                
                

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    7
                

                                    
                                                    
                
                
                
$body.on('mouseenter', 'a[data-layout]', function (e) {

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    8
                

                                    
                                                    
                
                
                
  const $target = $(e.currentTarget)

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    9
                

                                    
                                                    
                
                
                
  const layout = $target.data('layout')

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    10
                

                                    
                                                    
                
                
                
  showComponentScreenshot(layout, $target.closest('.acf-fc-popup'))

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    11
                

                                    
                                                    
                
                
                
})

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    12
                

                                    
                                                    
                
                
                

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    13
                

                                    
                                                    
                
                
                
$body.on('mouseleave', 'a[data-layout]', function (e) {

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    14
                

                                    
                                                    
                
                
                
  const $target = $(e.currentTarget)

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    15
                

                                    
                                                    
                
                
                
  hideComponentScreenshot($target.closest('.acf-fc-popup'))

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    16
                

                                    
                                                    
                
                
                
})

            


            
                                                                                                            
                                                                
            
                                    
            
            

                
                    17
                

                                    
                                                    
                
                
                

            


            
                                                                        
                            
            
                                    
            
            

                
                    18
                

                                    
                                                    
                
                
                
function showComponentScreenshot (layout, $wrapper) {

            


            
                                                                        
                            
            
                                    
            
            

                
                    19
                

                                    
                                                    
                
                
                
  const componentName = firstToUpperCase(layout)

            


            
                                                                        
                            
            
                                    
            
            

                
                    20
                

                                    
                                                    
                
                
                
  const image = `${wpData.templateDirectoryUri}/${wpData.components[componentName]}/screenshot.png`

            


            
                                                                        
                            
            
                                    
            
            

                
                    21
                

                                    
                                                    
                
                
                
  const $wrapperContainer = $("<div class='flyntComponentScreenshot-imageWrapper'>").appendTo($wrapper)

            


            
                                                                        
                            
            
                                    
            
            

                
                    22
                

                                    
                                                    
                
                
                

            


            
                                                                        
                            
            
                                    
            
            

                
                    23
                

                                    
                                                    
                
                
                
  getImage(image).done(function () {

            


            
                                                                        
                            
            
                                    
            
            

                
                    24
                

                                    
                                                    
                
                
                
    $wrapperContainer.prepend(`<img class='flyntComponentScreenshot-image' src='${image}'>`)

            


            
                                                                        
                            
            
                                    
            
            

                
                    25
                

                                    
                                                    
                
                
                
  })

            


            
                                                                        
                            
            
                                    
            
            

                
                    26
                

                                    
                                                    
                
                
                
}

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    27
                

                                    
                                                    
                
                
                

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    28
                

                                    
                                                    
                
                
                
function hideComponentScreenshot ($wrapper) {

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    29
                

                                    
                                                    
                
                
                
  $wrapper.find('.flyntComponentScreenshot-imageWrapper')

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    30
                

                                    
                                                    
                
                
                
    .remove()

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    31
                

                                    
                                                    
                
                
                
}

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    32
                

                                    
                                                    
                
                
                

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    33
                

                                    
                                                    
                
                
                
function firstToUpperCase (str) {

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    34
                

                                    
                                                    
                
                
                
  return str.substr(0, 1).toUpperCase() + str.substr(1)

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    35
                

                                    
                                                    
                
                
                
}

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    36
                

                                    
                                                    
                
                
                

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    37
                

                                    
                                                    
                
                
                
function getImage (image) {

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    38
                

                                    
                                                    
                
                
                
  if (!ajaxCache[image]) {

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    39
                

                                    
                                                    
                
                
                
    ajaxCache[image] = $.ajax({

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    40
                

                                    
                                                    
                
                
                
      url: image

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    41
                

                                    
                                                    
                
                
                
    })

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    42
                

                                    
                                                    
                
                
                
  }

            


            
                                                                                                            
                            
            
                                    
            
            

                
                    43
                

                                    
                                                    
                
                
                
  return ajaxCache[image]

            


            
                                                                                                            
                                                                
            
                                    
            
            

                
                    44
                

                                    
                                                    
                
                
                
}

            


            
                                                        
            
                                    
            
            

                
                    45